<template>
    <div class="edu-page-warp">
        <condition-card @reset="reset" @search="searchList" label-width="140px">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="毕业年份">
                        <el-date-picker
                            class="search-item"
                            :clearable = false
                            v-model="queryForm.condition.grade"
                            value-format="yyyy"
                            type="year"
                            placeholder="请选择"
                        ></el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="学院">
                        <el-select
                            v-model="queryForm.condition.faculty"
                            filterable
                            class="search-item"
                            clearable
                        >
                            <el-option
                                v-for="item in source.collegeOptions"
                                :key="item.collegeId"
                                :label="item.collegeIdI18n"
                                :value="item.collegeId"
                            />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
        </condition-card>
        <el-card shadow="never">
            <div class="edu-page-title">同济大学{{currentGrade}}年毕业设计(论文)情况统计表</div>
            <div class="edu-opertion-bar">
                <div class="float-right">
                    <el-button type="default" @click="exportFile()">{{$t('message.export')}}</el-button>
                </div>
            </div>
            <el-table :data="resultList" size="mini" style="width:100%" tooltip-effect="light">
                <el-table-column
                    label="学院"
                    prop="facultyI18n"
                    width="150px"
                    show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column
                    label="学生人数"
                    prop="studentTotal"
                    width="120px"
                    show-overflow-tooltip="true"
                ></el-table-column>
                <el-table-column label="课程类别">
                    <el-table-column label="课程类型">
                        <el-table-column
                            label="毕业设计"
                            prop="designCount"
                            width="120px"
                            show-overflow-tooltip="true"
                        ></el-table-column>
                        <el-table-column
                            label="毕业论文"
                            prop="paperCount"
                            width="120px"
                            show-overflow-tooltip="true"
                        ></el-table-column>
                    </el-table-column>
                    <el-table-column label="课程来源">
                        <el-table-column
                            v-for="(item, index) in sourceList"
                            :key="index"
                            :prop="`sourceCount[${index}]`"
                            min-width="120"
                        >
                            <template slot="header" slot-scope="scope">
                                <el-popover trigger="hover" placement="top">
                                    <span>{{item.subjectSource}}</span>
                                    <div
                                        slot="reference"
                                        style="width: 120px;padding: 0px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap;"
                                    >
                                        <span>{{item.subjectSource}}</span>
                                    </div>
                                </el-popover>
                            </template>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="课程性质" show-overflow-tooltip="true">
                        <el-table-column
                            v-for="(item, index) in natureList"
                            :key="index"
                            :prop="`propertyCount[${index}]`"
                            min-width="120"
                        >
                         <template slot="header" slot-scope="scope">
                                <el-popover trigger="hover" placement="top">
                                    <span>{{item.subjectProperties}}</span>
                                    <div
                                        slot="reference"
                                        style="width: 120px;padding: 0px;overflow:hidden;text-overflow:ellipsis;white-space: nowrap;"
                                    >
                                        <span>{{item.subjectProperties}}</span>
                                    </div>
                                </el-popover>
                            </template>
                        </el-table-column>
                    </el-table-column>
                </el-table-column>
                <el-table-column label="指导老师(含校外)">
                    <el-table-column label="合计" prop="teacherTotal" width="60px"></el-table-column>
                    <el-table-column label="正高级">
                        <el-table-column label="人数" prop="highCount" width="60px"></el-table-column>
                        <el-table-column label="占%" prop="highPercent" width="60px"></el-table-column>
                    </el-table-column>
                    <el-table-column label="副高级">
                        <el-table-column label="人数" prop="secondCount" width="60px"></el-table-column>
                        <el-table-column label="占%" prop="secondPercent" width="60px"></el-table-column>
                    </el-table-column>
                    <el-table-column label="中级">
                        <el-table-column label="人数" prop="middleCount" width="60px"></el-table-column>
                        <el-table-column label="占%" prop="middlePercent" width="60px"></el-table-column>
                    </el-table-column>
                </el-table-column>
                <el-table-column label="校外指导老师">
                    <el-table-column label="高校" prop="schoolCount" width="60px"></el-table-column>
                    <el-table-column label="企事业" prop="companyCount" width="80px"></el-table-column>
                </el-table-column>
                <el-table-column
                    label="人均指导学生人数"
                    prop="stuPercent"
                    width="150px"
                    show-overflow-tooltip="true"
                ></el-table-column>
            </el-table>
        </el-card>
    </div>
</template>
<script>
import API from 'common/src/api/underGraduationDesign/reviewSubject'
import { getList, exportExcel, getReportStatus } from 'common/src/api/underGraduationDesign/stastic'
import tools from 'common/src/views/underGraduationDesign/tools.js';
export default {
    name: 'graduateStastic',
    data() {
        return {
            api: API,
            queryForm: {
                condition: {
                    grade: new Date().getFullYear().toString(),
                    faculty: ''
                }
            },
            currentGrade: null,
            resultList: [],
            natureList: [],
            sourceList: [],
            source: {
                collegeOptions: []
            }
        }
    },
    mounted() {
        this.getCollege()
        this.searchList()
    },
    methods: {
        searchList() {
            let date = new Date()
            if (null == this.queryForm.condition.grade) {
                this.queryForm.condition.grade = date
            }
            var grade = this.queryForm.condition.grade
            if (grade instanceof Date) {
                grade = grade.getFullYear()
            }
            this.currentGrade = grade
            this.getSubjectNature(grade)
            this.getSubjectSource(grade)
            getList(grade, this.queryForm.condition.faculty).then(res => {
                this.resultList = res.data
            })
        },
        // 查课题性质
        getSubjectNature(grade) {
            const params = {
                year: grade
            }
            this.api
                .getNature(params)
                .then(res => {
                    this.natureList = res.data
                })
                .catch()
        },
        getSubjectSource(grade) {
            const params = {
                year: grade
            }
            this.api
                .getSource(params)
                .then(res => {
                    this.sourceList = res.data
                })
                .catch()
        },
        reset() {
            this.queryForm = {
                condition: {
                    grade: new Date(),
                    faculty: ''
                }
            }
            this.searchList()
        },
        // 查学院
        getCollege() {
            this.api.getCollege().then(res => {
                this.source.collegeOptions = res
            })
        },
        exportFile() {
            var grade = this.queryForm.condition.grade
            if (grade instanceof Date) {
                grade = grade.getFullYear()
            }
            exportExcel(grade, this.queryForm.condition.faculty).then(res => {
                // let loading = this.$loading({
                //     lock: false,
                //     text: 'Loading',
                //     spinner: 'el-icon-loading',
                //     background: 'rgba(255, 255, 255, .48)'
                // })
              tools.downloadFile(res.data.key, "学院毕业设计(论文)统计.xls", getReportStatus, this);
                // this._delayRequest(res.data.key)
            })
        },
        async _delayRequest(key) {
            this.loading = true
            await new Promise(resolve => setTimeout(resolve, 3000))
            getReportStatus(key)
                .then(res => {
                    if (res.code === 200 && res.data.status) {
                      tools.doDownload(res.data.path, "学院毕业设计(论文)统计.xls");
                       /* let path =
                            'api/designservice/resultPublish/downLoadMore?path=' +
                            res.data.path +
                            '&fileName=stastic.xls'
                        window.open(path)*/
                    } else {
                        this._delayRequest(key)
                    }
                })
                .catch(ex => {
                    this.loading = false
                    this._delayRequest(key)
                })
        }
    }
}
</script>
<style lang="scss" scoped>
.review-topic {
    .search-item {
        width: 100%;
    }
}
</style>
